<template>
	<view class="pages" :style="{ marginLeft: indentLevel * 20 + 'rpx' }">
		<!-- 显示节点的内容 -->
		<view class="node flex align-items ">
			<u-icon :name="isExpanded ?'arrow-down-fill' : 'play-right-fill'
" color="#2979ff" size="16" @click="toggleExpand" v-show="node.children && node.children.length>0"></u-icon>
			<view class="node_name" @click="jumpTo('/pages/InventoryCounting/Inventory',{
				partitionId :node.id,
				inventoryId :inventoryId ,
				address:node.partitionName,
				configureType:configureType
			})">{{node.partitionName}}</view>
			<view class="node_num" v-if="node.amount !== 0">({{ node.amount }})</view>
			<view class="node_flex">
				<view class="yi" v-if="node.state ==1">已盘</view>
				<!-- <view class="jin" v-if="node.state ==1">已盘</view> -->
				<view class="wei" v-if="node.state ==0">未盘</view>
			</view>
		</view>
		<!-- 递归地渲染子节点 -->
		<block v-if="node.children &&  node.children.length>0">
			<recursive-component v-if="isExpanded" v-for="(child, index) in node.children" :key="index" :node="child"
				:indentLevel="indentLevel + 1" :inventoryId='inventoryId'  />
		</block>

	</view>
</template>

<script>
	export default {
		name: 'RecursiveComponent',
		props: {
			node: {
				type: Object,
				required: true
			},
			indentLevel: {
				type: Number,
				default: 0
			},
			inventoryId: {
				type: [String, Number],
				default: ''
			},
			configureType:{
				type:[String,Number],
				default:''
			}

		},
		data() {
			return {
				isExpanded: false, // 默认展开
				totalDescendants: 0 // 总子集数量
			}
		},
		methods: {
			toggleExpand() {
				console.log(111);
				// 切换展开状态
				this.isExpanded = !this.isExpanded;
			},
			calculateTotalDescendants(node) {
				// 检查节点是否有子节点
				if (!node.children || node.children.length === 0) {
					return 0; // 如果没有子节点，返回 0
				}
				let count = node.children.length; // 初始化计数器为当前节点的子节点数量
				// 递归计算每个子节点的子节点数量
				for (const child of node.children) {
					count += this.calculateTotalDescendants(child);
				}
				return count; // 返回总子节点数量
			},
		},
		mounted() {},
		created() {
			// 计算总子集数量
			this.totalDescendants = this.calculateTotalDescendants(this.node);
		},
	};
</script>
<style scoped lang="scss">
	.node {
		height: 56rpx;

		&_name {
			margin-left: 10rpx;
		}

		&_num {
			margin-left: 8rpx;
		}

		&_flex {
			flex: 1;
			display: flex;
			justify-content: end;
		}
	}

	.yi {
		background-color: #e5efff;
		color: #5096ff;
		border: 1rpx solid #5096ff;
		font-size: 28rpx;
		padding: 8rpx 10rpx;
		border-radius: 8rpx;
		font-size: 26rpx;
	}

	.jin {
		background-color: #ebfff7;
		color: #6dddaf;
		border: 1rpx solid #6dddaf;
		font-size: 28rpx;
		padding: 8rpx 10rpx;
		border-radius: 8rpx;
		font-size: 26rpx;
	}

	.wei {
		background-color: #f7f7f7;
		color: #d5dadc;
		border: 1rpx solid #d9dadc;
		font-size: 28rpx;
		padding: 8rpx 10rpx;
		border-radius: 8rpx;
		font-size: 26rpx;
	}
</style>